<template>
  <div>
    <el-dialog
      title="确定已解决告警?"
      :visible.sync="sureWarningdialogVisible"
      width="70%"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
    >
      <div>
        <el-table
          
          element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading"
          :data="tableDataFn"
          border
          stripe
          style="width: 100%"
          
        >
          <el-table-column type="index" width="50" label="序号"> </el-table-column>
          <template v-for="item in tableColumns">
            <el-table-column
              :prop="item.prop"
              :sortable="item.sortable"
              :label="item.label"
              :width="item.width"
              align="center"
              v-if="item.isShow"
              :key="item.prop"
            >
              <template v-slot="scope">
                <template v-if="item.format == 'level'">
                  <div style="text-align: center">
                    <el-tag
                      :type="scope.row.levelType"
                      disable-transitions
                      effect="dark"
                    >
                      {{ scope.row[item.prop] }}
                    </el-tag>
                  </div>
                </template>
                <template v-else-if="item.format == 'action'">
                  <div style="text-align: center">
                    <el-button
                      type="info"
                      size="medium"
                      plain
                      @click="dialogVisible = true"
                      >查看</el-button
                    >
                  </div>
                </template>
                <template v-else>
                  <div>
                    {{ scope.row[item.prop] }}
                  </div>
                </template>
              </template>
            </el-table-column>
          </template>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="sureDialogClose">取 消</el-button>
        <el-button type="primary" @click="sureWarning">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { DetermineTheAlarm } from "@/api/index.js";
import tableColumns from "./WarningTableColumns.js";
export default {
  props: ["multipleSelection", "sureWarningdialogVisible"],
  computed: {
    tableDataFn() {
      return this.multipleSelection.filter((item) => {
        switch (item.ALERT_LEVEL) {
          case "1":
            item.ALERT_LEVEL = "提醒";
            item.levelType = "info";
            break;
          case "2":
            item.ALERT_LEVEL = "普通";
            item.levelType = "warning";
            break;
          case "3":
            item.ALERT_LEVEL = "紧急";
            item.levelType = "danger";
            break;

          default:
            break;
        }

        return item;
      });
    },
  },
  data() {
    return {
      tableColumns: tableColumns,
    };
  },
  methods: {
    sureDialogClose() {
        console.log(1)
      this.$emit("sureDialogClose");
    },
    sureWarning() {
      this.multipleSelection.forEach((item, index) => {
        DetermineTheAlarm({
          monid: item.MONID,
          ip: item.IP,
          alertinfo: item.ALERTINFO,
          infotype: item.INFOTYPE,
          monObject: item.MON_OBJECT,
          alertLevel: item.ALERT_LEVEL,
          type: item.SYSTEMNAME,
        }).then((_) => {
          if (_ === "success") {
            this.$message.success("确定告警成功");
          } else {
            this.$message.error("确定告警失败");
          }
          if (index == this.multipleSelection.length - 1) {
            this.$emit("sureDialogClose");
          }
        }).catch( e => {
            this.$message.error("确定告警失败,请稍后重试");
        });
      });
    },
  },
};
</script>